<%var jstpl = {%>
<script src="/static/plugin/wx_menu/jquery.validator.js"></script>
<script src="/static/plugin/wx_menu/pace.min.js"></script>
<script>
var form = layui.form;
form.verify({
	atleastone:function(value,item){
		if($("input[name='admin.role_id']:checked").length<=0){
			return "请至少选择一个权限组";
		}
	}
})
$(document).ready(function(){
    data=${menu_list!};
    if(data.length==0){
        Menu_tpl='<li class="menu_item current size1of1">'
        Menu_tpl+='<a href="javascript:void(0);" class="menu_link addBtn" title="最多添加3个一级菜单" draggable="false">';
        Menu_tpl+='<i class="icon_menu_add"></i>'
        Menu_tpl+='<span class="add" data-url="" data-id="">添加菜单</span></a>';
        Menu_tpl+='</li>'
        $(".footer_list").append(Menu_tpl);

    }else{
        $(".footer_list").removeClass("no_menu");
        if(data.length<3){
            for(var i=0;i<data.length;i++){
                Menu_tpl='<li class="menu_item">'
                Menu_tpl+='<a href="javascript:void(0);" class="menu_link" title="最多添加3个一级菜单" draggable="false">';
                Menu_tpl+='<span class="add" data-id="'+data[i].id+'" data-url="'+data[i].url+'">'+data[i].name+'</span></a>';
                Menu_tpl+='<div class="sub_pre_menu_box">';
                if(data[i].item){
                    Submenu_num=data[i].item.son.length;
                    Menu_tpl+='<ul class="sub_pre_menu_list" data-listnum="'+Submenu_num+'"> ';
                    var Sub_add_tpl='';
                    if(Submenu_num==5){
                        Sub_add_tpl=''
                    }else{
                        Sub_add_tpl+='<li class="addMenuBox">';
                        Sub_add_tpl+='<a href="javascript:void(0);" class="addL2Btn" title="最多添加5个子菜单" draggable="false">';
                        Sub_add_tpl+='<i class="icon_menu_add"></i>';
                        Sub_add_tpl+='<span class="title" data-url=""></span>';
                        Sub_add_tpl+='</span>';
                        Sub_add_tpl+='</a>';
                        Sub_add_tpl+='</li>';
                    }
                    Menu_tpl+=Sub_add_tpl;
                    for(var j=0;j<Submenu_num;j++){
                        var Sub_menu_tpl='';
                        Sub_menu_tpl='<li class="addMenuBox subMenu current">';
                        Sub_menu_tpl+='<a href="javascript:void(0);"  draggable="false">';
                        Sub_menu_tpl+='<span class="sub_pre_menu_inner">';
                        Sub_menu_tpl+='<span class="title" data-id="'+data[i].item.son[j].id+'" data-url="'+data[i].item.son[j].url+'">'+data[i].item.son[j].name+'</span>';
                        Sub_menu_tpl+='</span>';
                        Sub_menu_tpl+='</a>';
                        Sub_menu_tpl+='</li>';
                        Menu_tpl+=Sub_menu_tpl;
                    }
                    Menu_tpl+='</ul>';
                }else{
                    Menu_tpl+='<ul class="sub_pre_menu_list" data-listnum="0"> ';
                    Menu_tpl+='<li class="addMenuBox">';
                    Menu_tpl+='<a href="javascript:void(0);" class="addL2Btn" title="最多添加5个子菜单" draggable="false">';
                    Menu_tpl+='<i class="icon_menu_add"></i>';
                    Menu_tpl+='<span class="title" data-id="" data-url=""></span>';
                    Menu_tpl+='</span>';
                    Menu_tpl+='</a>';
                    Menu_tpl+='</li>';
                    Menu_tpl+='</ul>';
                }
                Menu_tpl+='<i class="arrow arrow_out"></i>';
                Menu_tpl+='<i class="arrow arrow_in"></i>';
                Menu_tpl+='</div>';
                Menu_tpl+='</li>'
                $(".footer_list").append(Menu_tpl);
            }
            Menu_tpl='<li class="menu_item">'
            Menu_tpl+='<a href="javascript:void(0);" class="menu_link addBtn" title="最多添加3个一级菜单" draggable="false">';
            Menu_tpl+='<i class="icon_menu_add"></i>';
            Menu_tpl+='<span class="add" data-url=""></span></a>';
            Menu_tpl+='</li>'
            $(".footer_list").append(Menu_tpl);
            $(".footer_list .menu_item").addClass("size1of"+Number(data.length+1));

        }else{
            for(var i=0;i<data.length;i++){
                Menu_tpl='<li class="menu_item">'
                Menu_tpl+='<a href="javascript:void(0);" class="menu_link" title="最多添加3个一级菜单" draggable="false">';
                Menu_tpl+='<span class="add" data-id="'+data[i].id+'" data-url="'+data[i].url+'">'+data[i].name+'</span></a>';
                Menu_tpl+='<div class="sub_pre_menu_box">';
                if(data[i].item){
                    Submenu_num=data[i].item.son.length;
                    Menu_tpl+='<ul class="sub_pre_menu_list" data-listnum="'+Submenu_num+'"> ';
                    var Sub_add_tpl='';
                    if(Submenu_num==5){
                        Sub_add_tpl=''
                    }else{
                        Sub_add_tpl+='<li class="addMenuBox">';
                        Sub_add_tpl+='<a href="javascript:void(0);" class="addL2Btn" title="最多添加5个子菜单" draggable="false">';
                        Sub_add_tpl+='<i class="icon_menu_add"></i>';
                        Sub_add_tpl+='<span class="title" data-url=""></span>';
                        Sub_add_tpl+='</span>';
                        Sub_add_tpl+='</a>';
                        Sub_add_tpl+='</li>';
                    }
                    Menu_tpl+=Sub_add_tpl;
                    for(var j=0;j<Submenu_num;j++){
                        var Sub_menu_tpl='';
                        Sub_menu_tpl='<li class="addMenuBox subMenu current">';
                        Sub_menu_tpl+='<a href="javascript:void(0);"  draggable="false">';
                        Sub_menu_tpl+='<span class="sub_pre_menu_inner">';
                        Sub_menu_tpl+='<span class="title" data-id="'+data[i].item.son[j].id+'" data-url="'+data[i].item.son[j].url+'">'+data[i].item.son[j].name+'</span>';
                        Sub_menu_tpl+='</span>';
                        Sub_menu_tpl+='</a>';
                        Sub_menu_tpl+='</li>';
                        Menu_tpl+=Sub_menu_tpl;
                    }
                    Menu_tpl+='</ul>';
                }else{
                    Menu_tpl+='<ul class="sub_pre_menu_list" data-listnum="0"> ';
                    Menu_tpl+='<li class="addMenuBox">';
                    Menu_tpl+='<a href="javascript:void(0);" class="addL2Btn" title="最多添加5个子菜单" draggable="false">';
                    Menu_tpl+='<i class="icon_menu_add"></i>';
                    Menu_tpl+='<span class="title" data-id="" data-url=""></span>';
                    Menu_tpl+='</span>';
                    Menu_tpl+='</a>';
                    Menu_tpl+='</li>';
                    Menu_tpl+='</ul>';
                }
                Menu_tpl+='<i class="arrow arrow_out"></i>';
                Menu_tpl+='<i class="arrow arrow_in"></i>';
                Menu_tpl+='</div>';
                Menu_tpl+='</li>'
                $(".footer_list").append(Menu_tpl);
                $(".footer_list .menu_item").addClass("size1of"+data.length);
            }
            add_Menu_tpl='';
            add_Menu_tpl+='<li class="menu_item size1of4">';
            add_Menu_tpl+='<a href="javascript:void(0);" class="addBtn menu_link" title="最多添加3个一级菜单" draggable="false">';
            add_Menu_tpl+='<i class="icon_menu_add"></i><span class="add" data-id="" data-url=""></span>'
            add_Menu_tpl+='</a>'
            add_Menu_tpl+='</li>';
            $(".footer_list").append(add_Menu_tpl);
        }

    }


    //============================================================
    //编辑
    var Menu_num=data.length;
    var Menu_index;
    //一级菜单
    $(".footer_list").on("click",".addBtn",function(){
        elm=$(this);
        url="/system/weixin/appconfig/add_parentMenu?name=菜单名称&id=${id!}&url=&sort="+Number(Menu_num+1);
        gx.ajax(url,function(ret){
            if(ret.state){
                data=ret.data;
                Menu_num=Menu_num+1;
                Menu_index=elm.parents(".footer_list .menu_item").index();
                if(Menu_num>3){$(".footer_list").off("click",".addBtn")}

                $(".edit_box").addClass("show");
                $(".none_tips").removeClass("show");

                elm.parents(".footer_list .menu_item").find("span.add").text("菜单名称");
                $(".menu_form_area").find(".menu-title").text("菜单名称");
                $(".menu_form_area").find(".bar_left").val("菜单名称");
                $(".menu_form_area").find(".menu_name").val("菜单名称");
                $(".menu_form_area").find(".menu_delete").text("删除菜单");
                $(".menu_form_area").find(".web_url").val("");


                $(".footer_list").removeClass("no_menu");
                $(".footer_list .menu_item").removeClass("current");
                $(".footer_list .menu_item").eq(Menu_index).addClass("current");
                $(".footer_list .menu_item").eq(Menu_index).find("a").removeClass("addBtn");
                $(".footer_list .menu_item").eq(Menu_index).find("i").addClass("hide");
                $(".footer_list .menu_item").eq(Menu_index).find(".add").data("id",data.id);


                slide_num=Menu_num+1;
                Menu_tpl='<li class="menu_item">'
                Menu_tpl+='<a href="javascript:void(0);" class="addBtn menu_link" title="最多添加3个一级菜单" draggable="false">';
                Menu_tpl+='<i class="icon_menu_add"></i>';
                Menu_tpl+='<span class="add" data-id="" data-url=""></span></a>';
                Menu_tpl+='</li>'

                $(".footer_list").append(Menu_tpl);
                $(".footer_list .menu_item").addClass("size1of"+slide_num);

                Sub_add_tpl='<div class="sub_pre_menu_box">';
                Sub_add_tpl+='<ul class="sub_pre_menu_list" data-listnum="0"> ';
                Sub_add_tpl+='<li class="addMenuBox">';
                Sub_add_tpl+='<a href="javascript:void(0);" class="addL2Btn" title="最多添加5个子菜单" draggable="false">';
                Sub_add_tpl+='<i class="icon_menu_add"></i>';
                Sub_add_tpl+='<span class="title" data-url=""></span>';
                Sub_add_tpl+='</span>';
                Sub_add_tpl+='</a>';
                Sub_add_tpl+='</li>';
                Sub_add_tpl+='</ul>';
                Sub_add_tpl+='<i class="arrow arrow_out"></i>';
                Sub_add_tpl+='<i class="arrow arrow_in"></i>';
                Sub_add_tpl+='</div>';
                $(".footer_list .menu_item").eq(Menu_index).append(Sub_add_tpl);
                $(" body .edit_box").removeClass("hide");//
                $(" body .edit_box").addClass("show");
            }else{
                layer.msg(ret.msg);
            }

        })
    })

    //二级菜单
    $(".footer_list").on("click",".addL2Btn",function(){
        Submenu_num=$(this).parents(".sub_pre_menu_list ").data("listnum");
        Submenu_index=$(this).parents(".sub_pre_menu_list .addMenuBox").index();
        Submenu_num=Submenu_num+1;
        id=$(this).parents(".menu_item").find(".add").data("id");
        elm=$(this);

        url="/system/weixin/appconfig/add_childMenu?name=子菜单名称&id=${id!}&url=&sort="+Number(Submenu_num)+"&pid="+id;
        gx.ajax(url,function(ret){
            if(ret.state){
                data=ret.data;
                $(".edit_box").addClass("show");
                $(".none_tips").removeClass("show");

                $(".menu_form_area").find(".group-url").removeClass("hide");
                $(".menu_form_area").find(".menu-title").text("子菜单名称");
                $(".menu_form_area").find(".bar_left").text("子菜单名称");
                $(".menu_form_area").find(".menu_name").val("子菜单名称");
                $(".menu_form_area").find(".menu_delete").text("删除子菜单");
                $(".menu_form_area").find(".web_url").val("");

                elm.parents(".sub_pre_menu_list").data("listnum",Submenu_num);
                elm.parents(".menu_item").addClass("uncurrent");
                $(".addMenuBox").removeClass("current");


                if(Submenu_num>4){
                    elm.parents(".sub_pre_menu_list").off("click",".addL2Btn");
                    elm.parents(".addMenuBox").addClass("hide");
                }

                Sub_menu_tpl='<li class="addMenuBox subMenu current">';
                Sub_menu_tpl+='<a href="javascript:void(0);"  draggable="false">';
                Sub_menu_tpl+='<span class="sub_pre_menu_inner">';
                Sub_menu_tpl+='<span class="title" data-id="'+data.id+'" data-url="">子菜单名称 </span>';
                Sub_menu_tpl+='</span>';
                Sub_menu_tpl+='</a>';
                Sub_menu_tpl+='</li>';

                elm.parents(".sub_pre_menu_list").append(Sub_menu_tpl);
                $(" body .edit_box").removeClass("hide");//
                $(" body .edit_box").addClass("show");
            }else{
                layer.msg(ret.msg);
            }

        })

    })




    //菜单编辑  从视图到表单
    $(".footer_list").on("click",".menu_link",function(){
        $(".footer_list .subMenu").removeClass("current");
        $(".footer_list .menu_item").removeClass("uncurrent");
        $(this).parents(".menu_item").addClass("current").siblings().removeClass("current");

        $(".edit_box").addClass("show");
        $(".none_tips").removeClass("show");
        //有下级子菜单的一级菜单不设置跳转地址
        if($(this).parents(".menu_item").find(".sub_pre_menu_list").data("listnum")>0){
            $(".menu_form_area").find(".group-url").addClass("hide");
        }else{
            $(".menu_form_area").find(".group-url").removeClass("hide");
        }

        text=$(this).find("span.add").text();
        $(".menu_form_area").find(".menu-title").text("菜单名称");
        $(".menu_form_area").find(".bar_left").text(text);
        $(".menu_form_area").find(".menu_delete").text("删除菜单");
        $(".menu_form_area").find(".menu_name").val(text);
        url=$(this).find("span.add").data("url");
        $(".menu_form_area").find(".web_url").val(url);
        $(" body .edit_box").removeClass("hide");//
        $(" body .edit_box").addClass("show");
    })

    $(".footer_list").on("click",".subMenu",function(){
        $(this).addClass("current").siblings().removeClass("current");
        $(this).parents(".menu_item").addClass("uncurrent");

        $(".edit_box").addClass("show");
        $(".none_tips").removeClass("show");

        $(".menu_form_area").find(".group-url").removeClass("hide");
        text=$(this).find(".title").text();
        $(".menu_form_area").find(".menu_delete").text("删除子菜单");
        $(".menu_form_area").find(".menu-title").text("子菜单名称");
        $(".menu_form_area").find(".bar_left").text(text);
        $(".menu_form_area").find(".menu_name").val(text);
        url=$(this).find(".title").data("url");
        $(".menu_form_area").find(".web_url").val(url);
        $(" body .edit_box").removeClass("hide");//
        $(" body .edit_box").addClass("show");

    })

    //表单    从表单到视图

    //名称
    $(".edit_box .menu_name").on("keyup",function(){
        elm=$(this);
        val=elm.val();
        if(val==""){
            elm.parents(".frm_control_group").find(".none_tips").addClass("show");
            return;
        }else{
            elm.parents(".frm_control_group").find(".none_tips").removeClass("show");
        }

        menu=$(".footer_list").find(".menu_item.current").length;
        submenu=$(".footer_list").find(".subMenu.current").length;
        //当前编辑一级菜单
        if(menu>0 && !submenu>0 ){
            $(".menu_item.current").find("span.add").text(val);
            $(".menu_form_area").find(".bar_left").text(val);

        }
        //当前编辑子菜单
        if(menu>0 && submenu>0 ){
            $(".subMenu.current").find(".title").text(val);
            $(".menu_form_area").find(".bar_left").text(val);
        }
    })

    //网址
    $(".edit_box .web_url").on("keyup",function(){
        elm=$(this);
        val=elm.val();
        if(val==""){
            elm.parents(".frm_control_group").find(".none_tips").addClass("show");
            return;
        }else{
            elm.parents(".frm_control_group").find(".none_tips").removeClass("show");
        }

        menu=$(".footer_list").find(".menu_item.current").length;
        submenu=$(".footer_list").find(".subMenu.current").length;
        //当前编辑一级菜单
        if(menu>0 && !submenu>0 ){
            $(".menu_item.current").find("span.add").data("url",val);

        }
        //当前编辑子菜单
        if(menu>0 && submenu>0 ){
            $(".subMenu.current").find(".title").data("url",val);
        }
    })


    //删除菜单
    $(".menu_delete").on("click",function(){
        menu=$(".footer_list").find(".menu_item.current").length;
        submenu=$(".footer_list").find(".subMenu.current").length;

        //当删除一级菜单
        if(menu>0 && !submenu>0 ){
            layer.confirm("确定要删除该一级菜单吗？",function(){
                id=$(".menu_item.current").find(".add").data("id");
                url="/system/weixin/appconfig/del_menu?id=${id!}&menu_id="+id;
                gx.ajax(url,function(ret){
                    if(ret.state){

                        $(".menu_item.current").remove();
                        slide_num=Menu_num+1;
                        slide_num_new=slide_num-1;
                        Menu_num= Menu_num-1;
                        if(Menu_num==0){
                            $(".footer_list").addClass("no_menu");
                            $(".footer_list .menu_item").addClass("current");
                            $(".footer_list").find("span.add").text("添加菜单");
                            $(".footer_list .menu_item").eq(Menu_num).find("a").addClass("addBtn");
                            $(".footer_list .menu_item").eq(Menu_num).find("i").removeClass("hide");
                        }

                        //进行前一级菜单编辑
                        // $(".footer_list .menu_item").eq(Menu_num-1).addClass("current");
                        $(".footer_list .menu_item").removeClass("size1of"+slide_num);
                        $(".footer_list .menu_item").addClass("size1of"+slide_num_new);
                        text=$(".footer_list .menu_item").eq(Menu_num-1).find("span.add").text();
                        $(".menu_form_area").find(".menu-title").text("菜单名称");
                        $(".menu_form_area").find(".bar_left").text(text);
                        $(".menu_form_area").find(".menu_delete").text("删除菜单");
                        $(".menu_form_area").find(".menu_name").val(text);
                        url=$(".footer_list .menu_item").eq(Menu_num-1).find("span.add").data("url");
                        $(".menu_form_area").find(".web_url").val(url);
                        $(" body .edit_box").removeClass("show");//删除成功把右侧隐藏掉
                        $(" body .edit_box").addClass("hide");
                        layer.msg('成功删除！');
                    }else{
                        layer.msg(ret.msg);
                    }

                })
            })
        }

        //当前删除子菜单
        if(menu>0 && submenu>0 ){
            layer.confirm('确定要删除该子级菜单吗？',function(){
                id=$(".subMenu.current").find(".title").data("id");
                url="/system/weixin/appconfig/del_menu?id=${id!}&menu_id="+id;
                gx.ajax(url,function(ret){
                    if(ret.state){
                        Submenu_num=$(".subMenu.current").parents(".sub_pre_menu_list").data("listnum");
                        Submenu_num=Submenu_num-1;
                        $(".subMenu.current").parents(".sub_pre_menu_list").data("listnum",Submenu_num);
                        if(Submenu_num<5){
                            $(".addMenuBox").removeClass("hide");

                        }

                        //子菜单删除,进入一级菜单编辑
                        $(".subMenu.current").parents(".menu_item.current").removeClass("uncurrent");
                        text=$(".subMenu.current").parents(".menu_item.current").find("span.add").text();
                        $(".menu_form_area").find(".menu-title").text("菜单名称");
                        $(".menu_form_area").find(".bar_left").text(text);
                        $(".menu_form_area").find(".menu_delete").text("删除菜单");
                        $(".menu_form_area").find(".menu_name").val(text);
                        url=$(".subMenu.current").parents(".menu_item.current").find("span.add").data("url");
                        $(".menu_form_area").find(".web_url").val(url);

                        layer.msg('成功删除！');
                        $(".subMenu.current").remove();
                    }else{
                        layer.msg(ret.msg);
                    }
                })
            })
        }
    })

    //保存数据,提交菜单
    $(".save-btn").click(function(){
        //菜单名称
        elm=$(".edit_box .menu_name");
        val=elm.val();
        if(val==""){
            layer.msg("请输入菜单名称!");
            elm.parents(".frm_control_group").find(".none_tips").addClass("show");
            elm.focus();
            return;
        }

        //菜单url
        elm=$(".edit_box .web_url");
        val=elm.val();
        if(!elm.parents(".group-url").hasClass("hide")){
            if(val==""){
                layer.msg("请输入网页地址!");
                elm.parents(".frm_control_group").find(".none_tips").addClass("show");
                elm.focus();
                return;
            }
        }

        menu=$(".footer_list").find(".menu_item.current").length;
        submenu=$(".footer_list").find(".subMenu.current").length;
        //当前编辑一级菜单
        if(menu>0 && !submenu>0 ){
            id=$(".menu_item.current").find("span.add").data("id");
            name=$(".edit_box .menu_name").val();
            web_url=$(".edit_box .web_url").val();
            url="/system/weixin/appconfig/edit_menu?config_id=${id!}&menu_id="+id+"&name="+name+"&url="+web_url;
            gx.ajax(url,function(ret){
                if(ret.state){
                    layer.msg("保存成功!");
                }else{
                    layer.msg(ret.msg);
                }
            })
        }
        //当前编辑子菜单
        if(menu>0 && submenu>0 ){
            id=$(".subMenu.current").find(".title").data("id");
            name=$(".edit_box .menu_name").val();
            web_url=$(".edit_box .web_url").val();
            url="/system/weixin/appconfig/edit_menu?config_id=${id!}&menu_id="+id+"&name="+name+"&url="+web_url;
            gx.ajax(url,function(ret){
                if(ret.state){
                    layer.msg("保存成功!");
                }else{
                    layer.msg(ret.msg);
                }
            })
        }
    })

    //发布菜单
    $(".submit-btn").click(function(){
        url="/system/weixin/appconfig/release_menu?id=${id!}";
        gx.ajax(url,function(ret){
            if(ret.state){
                layer.msg("发布成功!");
            }else{
                if(ret.msg!=null){
                    layer.msg(ret.msg);
                }else{
                    layer.msg("有网址未保存或网址格式不正确!");
                }
            }
        })

    })

})
//Modal 弹出初始化列表
$("body").on("shown.bs.modal","#jsModal",function(){
    url="/system/weixin/appconfig/url?id=${id!}";
    gx.ajax(url,function(ret){
        if(ret.state){
            tpl = $("#tpl_list1").html();
            laytpl(tpl).render(ret.data,function(html){ $(".main_list").html(html); });
        }else{
            $(".main_list").html('<tr><td colspan="4" class="data-empty"></td></tr>');
        }
    })
});

//切换分组
$(".modal-title span").on("click",function(){
    $(this).addClass("active").siblings().removeClass("active");
    type=$(this).index()+1;
    url="/system/weixin/appconfig/url?id=${id!}&type="+type;
    gx.ajax(url,function(ret){
        if(ret.state){
            tpl = $("#tpl_list1").html();
            laytpl(tpl).render(ret.data,function(html){ $(".main_list").html(html); });
        }else{
            $(".main_list").html('<tr><td colspan="4" class="data-empty"></td></tr>');
        }
    })
})

$("body").on("click",".btn-choose",function(){
    url=$(this).parents("tr").find(".url").text();
    $(".web_url").val(url);
    $("#jsModal").modal('hide');
})

</script>
<%};%>

<%var csstpl = {%>
<link href="/static/plugin/wx_menu/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
<style>
    * { outline:none;margin:0;padding:0;}
    ul{margin:0!important;}
    li{list-style:none;}
    .show{display:block!important;}
    .hide{display:none!important;}
    .none_tips{margin-bottom:0;color:#ff6263;display:none;}

    .container{border:1px solid #e8e8e8;min-width:920px;}
    .container .hd-title{padding:0 30px;border-bottom:1px solid #e8e8e8;}
    .container .hd-title h5{font-size:17px;height:50px;line-height:50px;font-weight:600;}
    .container .hd-title h5 .tips{color:#ff6263;font-weight:normal;}
    .container .menu_setting_area{padding:30px;overflow:hidden;zoom:1;}
    .container .menu_setting_area .menu_preview_area{float: left;margin-right: 15px;position: relative;overflow:hidden;}
    .container .menu_setting_area .menu_form_area{display: table-cell;vertical-align: top; float: none;width: auto;padding-left:15px;}
    .container .menu_setting_area  .menu_form_area:after {
        content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . . . . . . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";
        visibility: hidden;clear: both; height: 0!important;display: block; line-height: 0;}
    .container .menu_setting_area .menu_preview_area .mobile_menu_preview{position: relative;width: 320px;height: 580px;
        background: transparent url(/static/plugin/wx_menu/img/bg_mobile.png) no-repeat 0 0;
        background-position: 0 0;border: 1px solid #e8e8e8;}

    .container .menu_setting_area .menu_preview_area .mobile_menu_preview .mobile_hd {color: #fff; text-align: center; padding-top: 30px;font-size: 15px; width: auto;
        overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal; margin: 0 30px;font:16px/24px "微软雅黑";}


    .menu_preview_area .mobile_footer .footer_list {position: absolute;bottom: 0; left: 0; right: 0; border-top: 1px solid #e7e7eb;height:53px;
        background: transparent url(/static/plugin/wx_menu/img/bg_mobile_footer.png) no-repeat 0 0;background-position: 0 0;background-repeat: no-repeat;padding-left: 43px;}
    .menu_preview_area .mobile_footer .footer_list .menu_item{line-height:50px;position: relative; float: left;text-align: center;}
    .menu_preview_area .mobile_footer .footer_list .menu_item a{display: block;width: auto;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;word-wrap: normal;
        color: #616161;text-decoration: none;}
    .menu_preview_area .mobile_footer .footer_list .menu_item.current .menu_link{border: 1px solid #44b549;color: #44b549;}
    .menu_preview_area .mobile_footer .footer_list .menu_item.uncurrent .menu_link{border: none!important;color: #616161!important;}
    .menu_preview_area .mobile_footer .footer_list.no_menu .icon_menu_add{background: url("/static/plugin/wx_menu/img/icon_pic.png") 0 -24px no-repeat;}
    .menu_preview_area .icon_menu_add{background: url("/static/plugin/wx_menu/img/icon_pic.png") 0 0 no-repeat;width: 14px;height: 14px;
        vertical-align: middle;display: inline-block;margin-top: -2px;}

    .size1of1{width:100%;}
    .size1of2{width:50%!important;}
    .size1of3{width:33.33%!important;}
    .sub_pre_menu_box .arrow {position: absolute;left: 50%;margin-left: -6px;}
    .arrow_out {bottom:-6px;display:inline-block;width:0;height:0;border-width: 6px;border-style: dashed;
        border-color: transparent;border-bottom-width: 0; border-top-color: #d0d0d0; border-top-style: solid;}
    .arrow_in {bottom: -5px;display: inline-block;width: 0; height: 0; border-width: 6px; border-style: dashed;
        border-color: transparent;border-bottom-width: 0;border-top-color: #fafafa;border-top-style: solid;}
    .menu_item.current .sub_pre_menu_box{display:block;}
    .sub_pre_menu_box{position: absolute;left: 0; width: 100%; border: 1px solid #e8e8e8;bottom: 60px;
        background-color: #fafafa;border-top-width: 0;display:none;}
    .sub_pre_menu_box .addMenuBox:hover{background:#e8e8e8;}
    .sub_pre_menu_list li {line-height: 44px; height:45px;border-top: 1px solid #e8e8e8;}
    .sub_pre_menu_list li.current{border: 1px solid #44b549;color: #44b549;}

    .icon_menu_dot {background: url("/static/plugin/wx_menu/img/icon_pic.png") 0 -48px no-repeat;
        width: 7px;height: 7px; vertical-align: middle; display: inline-block; margin-right: 2px; margin-top: -2px;}
    .container .menu_setting_area .menu_form_area .edit_box{position:relative;border:1px solid #e8e8e8;background:#f8f8f8;min-height:578px;display:none;}
    .container .menu_setting_area .menu_form_area .edit_box .main{padding:0 30px;}
    .container .menu_setting_area .menu_form_area .edit_box .menu_bar{padding:15px 0;border-bottom:1px solid #e8e8e8;width:100%;}
    .container .menu_setting_area .menu_form_area .edit_box .menu_bar .bar_left{float:left;}
    .container .menu_setting_area .menu_form_area .edit_box .menu_bar .bar_right{text-align:right}
    .container .menu_setting_area .menu_form_area .edit_box .menu_form_bd{margin-top:30px;}
    .menu_form_bd .frm_control_group {padding-left:80px;position:relative;}
    .menu_form_bd .frm_control_group .title{position:absolute;left:0;font-weight:normal;padding:5px 0;}
    .menu_form_bd .frm_control_group .frm_controls input{width:340px;padding:5px 0;border:1px solid #e8e8e8;outline:none;text-indent:10px;}
    .menu_form_bd .frm_control_group .frm_controls input:focus{border:1px solid #44b549;}
    .menu_form_bd .frm_control_group .frm_controls p{padding:5px 0;}
    .menu_form_bd .frm_control_group.bottom_btn{margin-top:30px;}
    .menu_form_bd .frm_control_group.bottom_btn .btn{padding:5px 15px;border:1px solid #e8e8e8;border-radius:5px;}
    .menu_form_bd .frm_control_group.bottom_btn .sort-btn{color:#000000;}
    .menu_form_bd .frm_control_group.bottom_btn .save-btn{color:#fff;background:#44b549;margin-left:90px;}

    .link-btn{color:#000;background:#fff;border:1px solid #e8e8e8;}
    .link-btn:hover{color:#000;border:1px solid #44b549;}
    .bottom-con{background:#EEEEEE;height:50px;line-height:50px;text-align:center;position:absolute;bottom:0;width:100%;}
    .bottom-con .submit-btn{padding:8px 35px;border:1px solid #e8e8e8;border-radius:5px;color:#fff;background:#337ab7;}

    .modal-title span{margin:0 8px;cursor:pointer;font-size:16px;font-weight:600;}
    .modal-title span a{color:#333;}
    .modal-title span.active{color:#337ab7;}
    .modal-body{padding:15px;}
    .modal-body .table{margin:0;border-bottom:1px solid #e8e8e8;}
    .modal .table thead{background:#f1f1f1;}
    .modal .table th{height:40px;min-width:100px;}
    .modal .table td{height:50px;vertical-align:middle;}
    .btn-choose{padding:3px 8px!important;font-size:12px;}
    .modal .table td span.text-type{background:#468847;color:#fff;padding:0 5px;border-radius:2px;margin-right:10px;margin-left:5px;}
    .modal-body{max-height:400px;overflow:auto;}
    .data-empty{height:300px!important;background:url("/static/plugin/wx_menu/img/list_empty.png") no-repeat center;}
    .data-empty:hover{background-color:#fff;}


    .sub-menu ul > li > a.active, .sub-menu ul > li > a:hover { color: #000 !important }
    a:focus,a:hover{text-decoration: none !important; }
    .layui-form-switch{width: 55px !important;}
</style>
<%};%>


<%layout("../layout/_layout_layui.html",{title:'添加/修改微信配置信息',jstpl:jstpl,csstpl:csstpl}){ %>
	<section id="content">
	 <form  method="post" id="add_validate" action="/system/weixin/appconfig/save" class="layui-form  layui-form-pane form-horizontal"  role="form">
       <input type="hidden" name="cfg.id" value="${cfg.id!}">
       <div class="layui-row">

           <div class="layui-tab layui-tab-brief">
               <ul class="layui-tab-title">
                   <li class="layui-this">基本设置</li>
                   <li>开发设置</li>
                   <li>支付配置</li>
                   <li>菜单设置</li>
               </ul>
               <div class="layui-tab-content" >
                   <div class="layui-tab-item layui-show">
                       <div class="layui-form-item ">
                           <label class="layui-form-label">应用名称</label>
                           <div class="layui-input-block ">
                               <input type="text"  required  lay-verify="required"   name="cfg.app_title" value="${cfg.app_title!}"  class="layui-input" placeholder="">
                           </div>
                           <!-- <div class="layui-form-mid layui-word-aux">用户名不可以修改</div> -->
                       </div>

                       <div class="layui-form-item ">
                           <label class="layui-form-label">应用ID</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input"  required  lay-verify="required"     name="cfg.app_id" value="${cfg.app_id!}" >
                           </div>
                       </div>

                       <div class="layui-form-item ">
                           <label class="layui-form-label">应用秘钥</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input" required  lay-verify="required"   name="cfg.app_secret" value="${cfg.app_secret!}"  />

                           </div>
                       </div>

                   </div>


                   <div class="layui-tab-item">
                       <!--  开发配置  -->
                       <div class="layui-form-item">
                           <label class="layui-form-label">对接地址</label>
                           <div class="layui-input-block ">
                               <%if(cfg.id!null!=null){%>
                               <input type="text" class="layui-input"  readonly  value="${webhost!}/weixin/event/message?appid=${cfg.id!}" >
                               <%}else{%>
                               <input type="text" class="layui-input"  readonly  value="保存以后即可查看到保存地址" >
                               <%}%>
                           </div>
                       </div>

                       <div class="layui-form-item">
                           <label class="layui-form-label">token值</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input" name="cfg.token" lay-verify="required"
                                      value="${cfg.token!}" id="">
                           </div>
                       </div>


                       <div class="layui-form-item ">
                           <label class="layui-form-label">解密秘钥</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input" name="cfg.encodingAesKey" lay-verify="required"  value="${cfg.encodingAesKey!}" />
                           </div>
                       </div>

                       <div class="layui-form-item " pane>
                           <label class="layui-form-label">消息加密</label>
                           <div class="layui-input-block">
                               <input type="checkbox" ${cfg.message_encrypt!null==true?'checked':''} value="1"  name="cfg.message_encrypt" lay-skin="switch" lay-text="true|false">
                           </div>
                       </div>
                       <!--结束-->
                   </div>
                   <div class="layui-tab-item">
                       <!--支付配置-->
                       <div class="layui-form-item ">
                           <label class="layui-form-label">商户ID</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input"  name="cfg.wx_mchid" lay-verify="required"  value="${cfg.wx_mchid!}" />
                           </div>
                       </div>

                       <div class="layui-form-item ">
                           <label class="layui-form-label">支付秘钥</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input"  name="cfg.wx_key" lay-verify="required"  value="${cfg.wx_key!}" />
                           </div>
                       </div>

                       <div class="layui-form-item">
                           <label class="layui-form-label">证书文件</label>
                           <div class="layui-input-inline " style="width: 60%">
                               <input type="text" class="layui-input"  name="cfg.keystore_file_name" lay-verify="required"  value="${cfg.keystore_file_name!}" />
                           </div>
                           <div class="layui-form-mid " style="color: red;">为了安全文件请自行复制到 resources/weixin/cer 目录下面，这里直接写文件名称</div>
                       </div>

                       <div class="layui-form-item ">
                           <label class="layui-form-label">证书秘钥</label>
                           <div class="layui-input-block ">
                               <input type="text" class="layui-input"  name="cfg.keystore_password" lay-verify="required"  value="${cfg.keystore_password!}" >
                               <p  style="color: red;">*.填写商户号即可</p>
                           </div>
                       </div>
                       <!--支付配置结束-->
                   </div>
                   <div class="layui-tab-item">
                       <!-- 菜单设置开始-->
                       <%if(id!null!=null){%>
                       <div class="container ">
                           <div class="hd-title"><h5>自定义菜单<span class="tips">(点击左侧视图上的按钮进行操作)</span></h5></div>
                           <div class="menu_setting_area">
                               <div class="menu_preview_area">
                                   <div class="mobile_menu_preview">
                                       <div class="mobile_hd">${info.wy_name!}</div>
                                       <div class="mobile_footer">
                                           <ul class="footer_list no_menu">
                                           </ul>
                                       </div>
                                   </div>
                               </div>
                               <div class="menu_form_area">
                                   <div class="edit_box">
                                       <div class="main">
                                           <div class="menu_bar">
                                               <div class="bar_left">菜单名称</div>
                                               <div class="bar_right"><a href="javascript:;" class="menu_delete">删除菜单</a></div>
                                           </div>
                                           <div class="menu_form_bd">
                                               <div class="frm_control_group">
                                                   <label class="title menu-title">菜单名称 </label>
                                                   <div class="frm_controls">
                                                       <input type="text" placeholder="请输入名称" class="menu_name" />
                                                       <p class="none_tips">请输入菜单名称</p>
                                                       <p class="frm_tips">字数不超过4个汉字或8个字母</p>
                                                   </div>
                                               </div>
                                               <div class="frm_control_group group-url">
                                                   <label class="title url-title">网页链接</label>
                                                   <div class="frm_controls">
                                                       <input type="text" placeholder="请输入网页链接" class="web_url" />
                                                       <!-- data-toggle="modal" data-target="#jsModal" -->
                                                       <a class="btn link-btn" data-toggle="modal" data-target="#jsModal">系统链接</a>
                                                   </div>
                                                   <p class="none_tips">请输入网页链接</p>
                                               </div>
                                               <div class="frm_control_group bottom_btn">
                                                   <div class="frm_controls">
                                                       <!-- <a class="btn sort-btn">菜单排序</a> -->  <a class="btn save-btn">保存</a>
                                                   </div>
                                               </div>
                                           </div>
                                       </div>
                                       <div class="bottom-con"><a class="submit-btn btn">发布菜单</a></div>
                                   </div>
                               </div>

                           </div>

                       </div>
                       <!-- Modal -->
                       <div class="modal fade" id="jsModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                           <div class="modal-dialog" role="document">
                               <div class="modal-content">
                                   <div class="modal-header">
                                       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                       <h4 class="modal-title" id="jsModalLabel"><span class="active">地址</span></h4>
                                   </div>
                                   <div class="modal-body">
                                       <table class="table table-hover">
                                           <tbody>
                                           <thead>
                                           <tr>
                                               <th>名称</th>
                                               <th>链接地址 </th>
                                               <th>操作 </th>
                                           </tr>
                                           </thead>
                                           </tbody>
                                           <tbody class="main_list">
                                           <!--  <tr>
                                                       <td>店铺首页</td>
                                                       <td>www.baidu.com</td>
                                                       <td><a class="btn btn-choose btn-primary">选择</a></td>
                                                   </tr>
                                                   <tr>
                                                       <td>商品详情</td>
                                                       <td>www.baidu.com</td>
                                                       <td><a class="btn btn-choose btn-primary">选择</a></td>
                                                   </tr>  -->
                                           </tbody>
                                       </table>
                                   </div>
                                   <div class="modal-footer" id="modal-footer"></div>
                               </div>
                           </div>
                       </div>
                       <%}else{%>
                       <h1>请先保存其他设置，再来设置菜单</h1>
                       <%}%>
                       <!-- 菜单设置结束-->
                   </div>

               </div>
           </div>

         <div class="layui-form-item" style="margin-top: 10px">
			 <div class="layui-input-block">
			 <button  lay-submit lay-filter="formDemo" class="layui-btn"><i class=""></i>保存</button>
			  <button onclick="window.history.back()" type="button" class="layui-btn layui-btn-primary"><i class="zmdi zmdi-close"></i>返回</button>
			 </div>
		</div>
      
     </div>
               <!--  内容结束 -->
          </form>
     </section>

<%}%>
<script type="text/html" id="tpl_list1">
    {{# for(var i=0;i<d.length;i++){ }}
    <tr>
        <td>{{d[i].name}}</td>
        <td class="url">{{d[i].url}}</td>
        <td><a class="btn btn-choose btn-primary">选择</a></td>
    </tr>
    {{# } }}
</script>